<template>
  <view class="viewport" id="viewport">
    <view
      class="header1"
      id="header1"
      :style="{ paddingTop: safeAreaInsets.windowTop + 'px' }"
      v-if="!isSticky"
    >
      <view class="left icon-left" @tap="Onleft()"></view>
      <uni-title type="h1" align="center" title="打卡" class="text"></uni-title>
      <view v-if="query.ID" class="btn right" @tap="daka">打卡</view>
      <view v-if="!query.ID" class="btn right" @tap="submit">提交</view>
      <view v-if="query.ID != 19" class="btn left1" @tap="del">删除</view>
    </view>
    <view id="input" v-if="!isSticky">
      <input class="uni-input" v-model="title" placeholder="请输入标题" />
      <uni-data-checkbox class="chk" v-model="isColl" :localdata="checkdata" mode="default" />
    </view>
    <view class="calendar-content">
      <view>
        <!-- 插入模式 -->
        <uni-calendar
          class="uni-calendar--hook"
          :selected="info.selected"
          :showMonth="false"
          @monthSwitch="monthSwitch"
        />
      </view>
      <uni-calendar
        ref="calendar"
        class="uni-calendar--hook"
        :clear-date="true"
        :date="info.date"
        :insert="info.insert"
        :lunar="info.lunar"
        :startDate="info.startDate"
        :endDate="info.endDate"
        :range="info.range"
      />
    </view>
    <view class="remark">
      <uni-title :title="'起始时间：' + dakaStartTime" />
      <uni-title :title="'已打卡：' + dakaCount" />
    </view>
  </view>
</template>
<script setup lang="ts">
import { GetDaKaCalendarDataAPI } from '@/services/detail'
import {
  AddOrUpdate,
  DaKaAddOrUpdate,
  DaKaDel,
  DaKaNoteIndex,
  Del,
  NoteIndex,
} from '@/services/notelog'
import { useMemberStore } from '@/stores'
import type { GetCalendarDataResponse, GetDaKaCalendarDataRequest } from '@/types/detail'
import { onLoad, onPageScroll } from '@dcloudio/uni-app'
import { onMounted, ref } from 'vue'
const isSticky = ref(false)
const safeAreaInsets = uni.getSystemInfoSync()
const readOnly = false
const result = ref('')
const dakaStartTime = ref('--')
const dakaCount = ref('0')
const isColl = ref(false)
const formats = ref({})
const scrollTop = ref(0)
const windowHeightOrgin = ref(0)
const windowHeightCur = ref(0)
const initHeight = 0
const toolbarID = 0
const title = ref('')
const editorHeight = ref(400)
// 获取会员信息
const memberStore = useMemberStore()
// 定义 props 接收
const query = defineProps<{
  ID: number
  UserTitle: string
}>()
const checkdata = [
  { value: true, text: '置顶' },
  { value: false, text: '不置顶' },
]
const info = ref({
  lunar: true,
  range: false,
  insert: false,
  date: '',
  startDate: '',
  endDate: '',
  selected: ref<GetCalendarDataResponse[]>([]),
})
const form = ref<GetDaKaCalendarDataRequest>({
  DealYear: 0,
  DealMonth: 0,
  DaKaID: 0,
  Auth: '',
})

//加载初始化
onLoad(async () => {
  if (memberStore.profile) {
    const currentDate = new Date()
    form.value.DealYear = currentDate.getFullYear()
    form.value.DealMonth = currentDate.getMonth() + 1
    form.value.Auth = memberStore.profile!.Token
    if (query.ID) {
      form.value.DaKaID = query.ID
      const res = await DaKaNoteIndex({
        Auth: memberStore.profile.Token,
        UserName: '',
        ID: query.ID,
        UserTitle: '',
        NoteType: '',
        UserGroup: memberStore.profile.UserGroup,
      })
      var one = res.result[0]
      title.value = one.UserTitle
      result.value = one.UserContent
      isColl.value = one.IsColl
      dakaStartTime.value = getDate(one.CreateTime, 0).fullDate
      dakaCount.value = one.DaKaCount.toString()
    }
  } else {
    uni.showToast({ icon: 'none', title: '请先登录' })
    setTimeout(() => {
      // 页面跳转
      uni.switchTab({ url: '/pages/my/my' })
    }, 500)
  }
  if (query.UserTitle) {
    title.value = query.UserTitle
  }
  await reFresh()
})
const submit = async () => {
  if (memberStore.profile) {
    await DaKaAddOrUpdate({
      Auth: memberStore.profile.Token,
      ID: query.ID,
      UserName: memberStore.profile.UserName,
      IsColl: isColl.value,
      UserTitle: title.value,
      UserContent: result.value,
      UserGroup: memberStore.profile.UserGroup,
    })
    uni.showToast({ icon: 'success', title: '提交成功' })
    setTimeout(() => {
      // 页面跳转
      Onleft()
    }, 500)
  }
}
const daka = async () => {
  if (memberStore.profile) {
    await DaKaAddOrUpdate({
      Auth: memberStore.profile.Token,
      ID: query.ID,
      UserName: memberStore.profile.UserName,
      IsColl: isColl.value,
      UserTitle: title.value,
      UserContent: result.value,
      UserGroup: memberStore.profile.UserGroup,
    })
    uni.showToast({ icon: 'success', title: '打卡成功' })
    setTimeout(() => {
      // 页面跳转
      Onleft()
    }, 500)
  }
}
const del = async () => {
  if (memberStore.profile) {
    await DaKaDel({
      Auth: memberStore.profile.Token,
      ID: query.ID,
    })
    uni.showToast({ icon: 'success', title: '删除成功' })
    setTimeout(() => {
      // 页面跳转
      Onleft()
    }, 500)
  }
}
//返回
const Onleft = () => {
  uni.navigateTo({ url: '/pages/NoteAcount/DaKa' })
}
//选择月份事件
const monthSwitch = (e: any) => {
  form.value.DealYear = e.year
  form.value.DealMonth = e.month
  reFresh()
}
//刷新事件
const reFresh = async () => {
  if (memberStore.profile) {
    if (memberStore.profile.Token) {
      const res = await GetDaKaCalendarDataAPI(form.value)
      info.value.selected = res.result

      info.value.date = getDate(new Date(), -30).fullDate
      info.value.startDate = getDate(new Date(), -60).fullDate
      info.value.endDate = getDate(new Date(), 30).fullDate
      uni.showToast({ icon: 'success', title: '刷新成功' })
    }
  } else {
    uni.showToast({ icon: 'none', title: '请先登录' })
    setTimeout(() => {
      // 页面跳转
      uni.switchTab({ url: '/pages/my/my' })
    }, 500)
  }
}
/**
 * 获取任意时间
 */
const getDate = (date: Date, AddDayCount: number) => {
  if (!date) {
    date = new Date()
  }
  const dd = new Date(date)

  dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期

  const y = dd.getFullYear()
  const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期，不足10补0
  const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号，不足10补0
  return {
    fullDate: y + '-' + m + '-' + d,
    year: y,
    month: m,
    date: d,
    day: dd.getDay(),
  }
}
</script>

<style lang="scss">
@import './styles/NoteLog.scss';
</style>
